SherbyNet - /page/wikibook/entry.mu

Micron Document

<!DOCTYPE html>

<title>Syntax highlighting</title>

</head>

Syntax highlighting

</h1>

</header>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hatnote{font-style:italic}.mw-parser-output div.hatnote{padding-left:1.6em;margin-bottom:0.5em}.mw-parser-output .hatnote i{font-style:normal}.mw-parser-output .hatnote+link+.hatnote{margin-top:-0.5em}@media print{body.ns-0 .mw-parser-output .hatnote{display:none!important}}

/* end https://en.wikipedia.org/ */

</style>

Syntax highlighting is a feature of <a href="Text_editor" title="Text editor">text editors</a> that is used for <a href="Programming_language" title="Programming language">programming</a>, <a href="Scripting_language" title="Scripting language">scripting</a>, or <a href="Markup_language" title="Markup language">markup</a> languages, such as <a href="HTML" title="HTML">HTML</a>. The feature displays text, especially <a href="Source_code" title="Source code">source code</a>, in different <a href="Text_color" class="mw-redirect" title="Text color">colours</a> and <a href="Font" title="Font">fonts</a> according to the category of terms.<a href="#cite_note-1">[1]</a> This feature facilitates writing in a structured language such as a programming language or a markup language as both structures and <a href="Syntax_error" title="Syntax error">syntax errors</a> are visually distinct. This feature is also employed in many programming related contexts (such as programming manuals), either in the form of colourful books or online websites to make understanding code snippets easier for readers. Highlighting does not affect the meaning of the text itself; it is intended only for human readers.

Syntax highlighting is a form of <a href="Secondary_notation" title="Secondary notation">secondary notation</a>, since the highlights are not part of the text meaning, but serve to reinforce it. Some editors also integrate syntax highlighting with other features, such as <a href="Spell_checking" class="mw-redirect" title="Spell checking">spell checking</a> or <a href="Code_folding" title="Code folding">code folding</a>, as aids to editing which are external to the language.

<div class="mw-heading mw-heading2"><h2 id="Practical_benefits">Practical benefits</h2></div>

Syntax highlighting is one strategy to improve the readability and context of the text; especially for code that spans several pages. The reader can easily ignore large sections of comments or code, depending on what they are looking for.

Syntax highlighting also helps programmers find errors in their program. For example, most editors highlight <a href="String_literal" title="String literal">string literals</a> in a different colour. Consequently, spotting a missing <a href="String_literal#Bracketed_delimiters" title="String literal">delimiter</a> is much easier because of the contrasting colour of the text. <a href="Brace_matching" class="mw-redirect" title="Brace matching">Brace matching</a> is another important feature with many popular editors. This makes it simple to see if a brace has been left out or locate the match of the brace the cursor is on by highlighting the pair in a different colour.

A study published in the conference <a href="Psychology_of_programming" title="Psychology of programming">PPIG</a> evaluated the effects of syntax highlighting on the comprehension of short programs, finding that the presence of syntax highlighting significantly reduces the time taken for a programmer to internalise the semantics of a program.<a href="#cite_note-:0-2">[2]</a> Additionally, data gathered from an eye-tracker during the study suggested that syntax highlighting enables programmers to pay less attention to standard syntactic components such as keywords.

<div class="mw-heading mw-heading2"><h2 id="Support_in_text_editors">Support in text editors</h2></div>

Some text editors can also export the coloured markup in a format that is suitable for printing or for importing into word-processing and other kinds of text-formatting software; for instance as a HTML, colourized LaTeX, <a href="PostScript" title="PostScript">PostScript</a> or <a href="Rich_Text_Format" title="Rich Text Format">RTF</a> version of its syntax highlighting. There are several syntax highlighting <a href="Library_(computing)" title="Library (computing)">libraries</a> or "engines" that can be used in other applications, but are not complete programs in themselves, for example the Generic Syntax Highlighter (GeSHi) extension for <a href="PHP" title="PHP">PHP</a>.

For editors that support more than one language, the user can usually specify the language of the text, such as <a href="C_(programming_language)" title="C (programming language)">C</a>, <a href="LaTeX" title="LaTeX">LaTeX</a>, <a href="HTML" title="HTML">HTML</a>, or the text editor can automatically recognize it based on the file extension or by scanning contents of the file. This automatic language detection presents potential problems.<a href="#cite_note-PLangRec-3">[3]</a> For example, a user may want to edit a document containing:

<ul><li>more than one language (for example when editing an <a href="HTML" title="HTML">HTML</a> file that contains embedded <a href="JavaScript" title="JavaScript">JavaScript</a> code),</li>

<li>a language that is not recognized (for example when editing source code for an obscure or relatively new programming language),</li>

<li>a language that differs from the file type (for example when editing source code in an extension-less file in an editor that uses file extensions to detect the language).</li></ul>

In these cases, it is not clear what language to use, and a document may not be highlighted or be highlighted incorrectly. Some tools, like Guesslang and PLangRec, are designed to detect the programming language from the source code.<a href="#cite_note-PLangRec-3">[3]</a>

<div class="mw-heading mw-heading2"><h2 id="Syntax_elements">Syntax elements</h2></div>

Most editors with syntax highlighting allow different colours and text styles to be given to dozens of different lexical sub-elements of syntax. These include keywords, comments, control-flow statements, variables, and other elements. Programmers often heavily customize their settings in an attempt to show as much useful information as possible without making the code difficult to read.

Called syntax decoration, some editors also display certain syntactical elements in more visually pleasing ways, for example by replacing a pointer operator like <code>-></code> in source code by an actual arrow symbol (→), or changing <a href="Text_decoration" class="mw-redirect" title="Text decoration">text decoration</a> clues like /italics/, *boldface*, or _underline_ in source code comments by an actual italics, boldface, or underlined presentation.

<div class="mw-heading mw-heading3"><h3 id="Examples">Examples</h3></div>

Below is a comparison of a <a href="Snippet_(programming)" title="Snippet (programming)">snippet</a> of <a href="C_(programming_language)" title="C (programming language)">C</a> code:

<th>Standard rendering

</th>

<th>Syntax highlighting

</th></tr>

<tr>

<td>

<div class="mw-highlight mw-highlight-lang-text mw-content-ltr" dir="ltr"><pre>/* Hello World */

#include <stdlib.h>

#include <stdio.h>

int main()

{

printf("Hello World\n");

return 0;

}

</pre></div>

</td>

<td>

<div class="mw-highlight mw-highlight-lang-c mw-content-ltr" dir="ltr"><pre>/* Hello World */

#include <stdlib.h>

#include <stdio.h>

int main()

{

printf("Hello World\n");

return 0;

}

</pre></div>

</td></tr></tbody></table>

Below is another snippet of syntax highlighted <a href="C%2B%2B" title="C++">C++</a> code:

<div class="mw-highlight mw-highlight-lang-cpp mw-content-ltr" dir="ltr"><pre>// Create "window_count" Window objects:

const auto window_count = int{10};

auto windows = std::array<std::shared_ptr<Window>, max_window_count>{};

for (auto i = int{0}; i < window_count; ++i) {

windows[i] = std::make_shared<Window>();

}

</pre></div>

In the C++ example, the editor has recognized the <a href="Keyword_(computer_programming)" class="mw-redirect" title="Keyword (computer programming)">keywords</a> <code>const</code>, <code>auto</code>, <code>int</code>, and <code>for</code>. The <a href="Comment_(computer_programming)" title="Comment (computer programming)">comment</a> at the beginning is also highlighted in a specific manner to distinguish it from working code.

<div class="mw-heading mw-heading2"><h2 id="History_and_limitations">History and limitations</h2></div>

The ideas of syntax highlighting overlap significantly with those of <a href="Structure_editor" title="Structure editor">syntax-directed editors</a>. One of the first such editors for code was Wilfred Hansen's 1969 code editor, Emily.<a href="#cite_note-hansen-4">[4]</a><a href="#cite_note-5">[5]</a> It provided advanced language-independent <a href="Autocomplete" title="Autocomplete">code completion</a> facilities, and unlike modern editors with syntax highlighting, actually made it impossible to create syntactically incorrect programs.

In 1982, Anita H. Klock and Jan B. Chodak filed a patent for the first known syntax highlighting system,<a href="#cite_note-6">[6]</a> which was used in the Intellivision's <a href="Entertainment_Computer_System" title="Entertainment Computer System">Entertainment Computer System</a> (ECS) peripheral, released in 1983.<a href="#cite_note-7">[7]</a> It would highlight different elements of BASIC programs and was implemented in an attempt to make it easier for beginners, especially children, to start writing code.<a href="#cite_note-8">[8]</a> Later, the Live Parsing Editor (<a href="LEXX_(text_editor)" title="LEXX (text editor)">LEXX</a>) written for the <a href="VM_(operating_system)" title="VM (operating system)">VM</a> operating system for the computerization of the <a href="Oxford_English_Dictionary" title="Oxford English Dictionary">Oxford English Dictionary</a> in 1985 was one of the first to use colour syntax highlighting. Its live parsing capability allowed user-supplied parsers to be added to the editor, for text, programs, data file, etc.<a href="#cite_note-9">[9]</a> On <a href="Microcomputers" class="mw-redirect" title="Microcomputers">microcomputers</a>, MacPascal 1.0 (October 10, 1985) recognized Pascal syntax as it was typed and used font changes (e.g., bold for keywords) to highlight syntax on the monochrome <a href="Compact_Macintosh" title="Compact Macintosh">compact Macintosh</a> and automatically indented code to match its structure.<a href="#cite_note-macpascal-10">[10]</a>

Some text editors and code formatting tools perform syntax highlighting using <a href="Pattern_matching" title="Pattern matching">pattern matching</a> <a href="Heuristics" class="mw-redirect" title="Heuristics">heuristics</a> (e.g. <a href="Regular_expressions" class="mw-redirect" title="Regular expressions">Regular expressions</a>) rather than implementing a <a href="Parser" class="mw-redirect" title="Parser">parser</a> for each possible language.<a href="#cite_note-11">[11]</a> This can result in a text rendering system displaying somewhat inaccurate syntax highlighting and in some cases performing slowly. A solution used by text editors to overcome this problem is not always parsing the whole file but rather just the visible area, sometimes scanning backwards in the text up to a limited number of lines for "syncing".

On the other hand, the editor often displays code during its creation, while it is incomplete or incorrect, and the strict parsers (like ones used in compilers) would fail to parse the code most of the time.

Some modern, language-specific <a href="Integrated_development_environment" title="Integrated development environment">IDEs</a> (in contrast to text editors) perform full language parsing which results in very accurate understanding of code. An extension of syntax highlighting was called "semantic highlighting" in 2009 by David Nolden<a href="#cite_note-12">[12]</a> for the open-source C++ IDE <a href="KDevelop" title="KDevelop">KDevelop</a>. For example, semantic highlighting may give local variables unique distinct colours to improve the comprehensibility of code. In 2014 the idea of coloured local variables was further popularized due to a blog post by Evan Brooks,<a href="#cite_note-13">[13]</a> and after that, the idea was transferred to other popular IDEs like <a href="Visual_Studio" title="Visual Studio">Visual Studio</a>,<a href="#cite_note-14">[14]</a> <a href="Xcode" title="Xcode">Xcode</a>,<a href="#cite_note-15">[15]</a> and others.

Colour in a user interface is less useful if the user has some degree of <a href="Color_blindness" title="Color blindness">colour blindness</a>.

<ul><li><a href="Comparison_of_text_editors#Programming_features" title="Comparison of text editors">Programming features</a> in a <a href="Comparison_of_text_editors" title="Comparison of text editors">Comparison of text editors</a></li>

<li><a href="Indent_style" class="mw-redirect" title="Indent style">Indent style</a></li>

<li><a href="Secondary_notation" title="Secondary notation">Secondary notation</a></li>

<li><a href="Structure_editor" title="Structure editor">Structure editor</a></li>

<li><a href="Parsing" title="Parsing">Parsing</a></li>

<li><a href="Solarized_(color_scheme)" class="mw-redirect" title="Solarized (color scheme)">Solarized (colour scheme)</a></li></ul>

<div class="mw-heading mw-heading2"><h2 id="References">References</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .reflist{margin-bottom:0.5em;list-style-type:decimal}@media screen{.mw-parser-output .reflist{font-size:90%}}.mw-parser-output .reflist .references{font-size:100%;margin-bottom:0;list-style-type:inherit}.mw-parser-output .reflist-columns-2{column-width:30em}.mw-parser-output .reflist-columns-3{column-width:25em}.mw-parser-output .reflist-columns{margin-top:0.3em}.mw-parser-output .reflist-columns ol{margin-top:0}.mw-parser-output .reflist-columns li{page-break-inside:avoid;break-inside:avoid-column}.mw-parser-output .reflist-upper-alpha{list-style-type:upper-alpha}.mw-parser-output .reflist-upper-roman{list-style-type:upper-roman}.mw-parser-output .reflist-lower-alpha{list-style-type:lower-alpha}.mw-parser-output .reflist-lower-greek{list-style-type:lower-greek}.mw-parser-output .reflist-lower-roman{list-style-type:lower-roman}

/* end https://en.wikipedia.org/ */

</style><div class="reflist">

/* start https://en.wikipedia.org/ */

.mw-parser-output cite.citation{font-style:inherit;word-wrap:break-word}.mw-parser-output .citation q{quotes:"\"""\"""'""'"}.mw-parser-output .citation:target{background-color:rgba(0,127,255,0.133)}.mw-parser-output .id-lock-free.id-lock-free a{background:url("./mw/Lock-green.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-limited.id-lock-limited a,.mw-parser-output .id-lock-registration.id-lock-registration a{background:url("./mw/Lock-gray-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-subscription.id-lock-subscription a{background:url("./mw/Lock-red-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .cs1-ws-icon a{background:url("./mw/Wikisource-logo.svg")right 0.1em center/12px no-repeat}body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-free a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-limited a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-registration a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-subscription a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .cs1-ws-icon a{background-size:contain;padding:0 1em 0 0}.mw-parser-output .cs1-code{color:inherit;background:inherit;border:none;padding:inherit}.mw-parser-output .cs1-hidden-error{display:none;color:var(--color-error,#d33)}.mw-parser-output .cs1-visible-error{color:var(--color-error,#d33)}.mw-parser-output .cs1-maint{display:none;color:#085;margin-left:0.3em}.mw-parser-output .cs1-kern-left{padding-left:0.2em}.mw-parser-output .cs1-kern-right{padding-right:0.2em}.mw-parser-output .citation .mw-selflink{font-weight:inherit}@media screen{.mw-parser-output .cs1-format{font-size:95%}html.skin-theme-clientpref-night .mw-parser-output .cs1-maint{color:#18911f}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .cs1-maint{color:#18911f}}

/* end https://en.wikipedia.org/ */

</style><cite id="CITEREFJim_D'AnjouSherry_ShavorScott_FairbrotherDan_Kehn2005" class="citation book cs1">Jim D'Anjou; Sherry Shavor; Scott Fairbrother; Dan Kehn; John Kellerman; Pat McCarthy (2005). The Java developer's guide to Eclipse (2nd ed.). Boston: Addison-Wesley. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a> <bdi>978-0-321-30502-2</bdi>.</cite>

</li>

<li id="cite_note-:0-2"><a href="#cite_ref-:0_2-0">^</a> <cite id="CITEREFSarkar2015" class="citation journal cs1">Sarkar, Advait (2015). <a rel="nofollow" class="external text" href="https://ppig.org/papers/2015-ppig-26th-sarkar1/">"The impact of syntax colouring on program comprehension"</a>. Proceedings of the 26th Annual Conference of the Psychology of Programming Interest Group: 49–58. <a rel="nofollow" class="external text" href="https://web.archive.org/web/20150924080735/http://www.ppig.org/library/paper/impact-syntax-colouring-program-comprehension">Archived</a> from the original on 24 September 2015. Retrieved 27 September 2023.</cite>

</li>

<li id="cite_note-PLangRec-3">^ <a href="#cite_ref-PLangRec_3-0">a</a> <a href="#cite_ref-PLangRec_3-1">b</a> <cite id="CITEREFOscar_Rodriguez-PrietoAlejandro_PatoFrancisco_Ortin2025" class="citation journal cs1">Oscar Rodriguez-Prieto; Alejandro Pato; Francisco Ortin (2025). <a rel="nofollow" class="external text" href="https://doi.org/10.1016%2Fj.future.2024.107640">"PLangRec: Deep-learning model to predict the programming language from a single line of code"</a>. Future Generation Computer Systems. 166 107640. Elsevier. <a href="Doi_(identifier)" class="mw-redirect" title="Doi (identifier)">doi</a>:<a rel="nofollow" class="external text" href="https://doi.org/10.1016%2Fj.future.2024.107640">10.1016/j.future.2024.107640</a>.</cite>

</li>

<li id="cite_note-hansen-4"><a href="#cite_ref-hansen_4-0">^</a> <cite id="CITEREFHansen1971" class="citation conference cs1">Hansen, Wilfred J. (1971). "User engineering principles for interactive systems". Proceedings of the Fall Joint Computer Conference FJCC 39. AFIPS. pp. 5623–532.</cite>

</li>

<li id="cite_note-5"><a href="#cite_ref-5">^</a> <cite id="CITEREFHansen" class="citation web cs1">Hansen, Wilfred. <a rel="nofollow" class="external text" href="https://www.cs.cmu.edu/~wjh/Emily.html">"Emily - An Editor for Structured Text"</a>. Retrieved 17 June 2013.</cite>

</li>

<li id="cite_note-6"><a href="#cite_ref-6">^</a> <cite class="citation cs2"><a rel="nofollow" class="external text" href="https://patents.google.com/patent/US4617643A/en">Syntax error correction method and apparatus</a>, 1982-10-29, retrieved 2018-04-12</cite>

</li>

<li id="cite_note-7"><a href="#cite_ref-7">^</a> <cite class="citation book cs1"><a rel="nofollow" class="external text" href="https://archive.org/details/Intellivision_Computer_Module_Owners_Guide_1983_Mattel_US">Mattel Intellivision: Intellivision Computer Module Owner's Guide (1983)(Mattel)(US)</a>. 1983.</cite>

</li>

<li id="cite_note-8"><a href="#cite_ref-8">^</a> <cite class="citation web cs1 cs1-prop-unfit"><a rel="nofollow" class="external text" href="https://web.archive.org/web/20180717123313/http://www.intellivisionlives.com/bluesky/hardware/ecs_tech.html">"Intellivision Classic Video Game System / Entertainment Computer System"</a>. www.intellivisionlives.com. Archived from the original on 2018-07-17. Retrieved 2018-04-12.</cite>

</li>

<li id="cite_note-9"><a href="#cite_ref-9">^</a> <cite id="CITEREFCowlishaw,_M._F.1987" class="citation web cs1"><a href="Mike_Cowlishaw" title="Mike Cowlishaw">Cowlishaw, M. F.</a> (1987). <a rel="nofollow" class="external text" href="http://www.research.ibm.com/journal/rd/311/ibmrd3101G.pdf">"LEXX – A programmable structured editor"</a> (PDF). IBM Journal of Research and Development, Vol 31, No. 1, IBM Reprint order number G322-0151. IBM.</cite>

</li>

<li id="cite_note-macpascal-10"><a href="#cite_ref-macpascal_10-0">^</a> <cite id="CITEREFAllen2011" class="citation mailinglist cs1"><a href="Bruce_Perens" title="Bruce Perens">Allen, Dan</a> (2011-10-10). <a rel="nofollow" class="external text" href="https://web.archive.org/web/20170821213822/https://lists.apple.com/archives/mpw-dev/2011/Oct/msg00000.html">"A Trio of Historical Recollections"</a>. mpw-dev (Mailing list). Archived from <a rel="nofollow" class="external text" href="https://lists.apple.com/archives/mpw-dev/2011/Oct/msg00000.html">the original</a> on 2017-08-21. Retrieved 12 September 2019.</cite>

</li>

<li id="cite_note-11"><a href="#cite_ref-11">^</a> <cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://www.kedit.com/wwkld.html">"KEDIT Language Definition Files"</a>. <a href="XEDIT#PC_and_Unix_adaptations" title="XEDIT">Kedit</a>. Mansfield Software Group, Inc. 2012. Retrieved 2016-04-07.</cite>

</li>

<li id="cite_note-12"><a href="#cite_ref-12">^</a> <cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://zwabel.wordpress.com/2009/01/08/c-ide-evolution-from-syntax-highlighting-to-semantic-highlighting/">"2009 blog post on Semantic Highlighting introduced in KDevelop by David Nolden"</a>. 8 January 2009.</cite>

</li>

<li id="cite_note-13"><a href="#cite_ref-13">^</a> <cite id="CITEREFBrooks2017" class="citation web cs1">Brooks, Evan (17 April 2017). <a rel="nofollow" class="external text" href="https://medium.com/@evnbr/coding-in-color-3a6db2743a1e">"2014 blog post on Semantic Highlighting by Evan Brooks"</a>. Medium.</cite>

</li>

<li id="cite_note-14"><a href="#cite_ref-14">^</a> <cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://visualstudiomagazine.com/articles/2014/08/01/semantic-code-highlighting.aspx">"Visual Studio Magazine article on semantic highlighting"</a>.</cite>

</li>

<li id="cite_note-15"><a href="#cite_ref-15">^</a> <cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://github.com/kolinkrewinkel/Polychromatic">"Github page of a plugin which implements semantic highlighting for Xcode"</a>. <a href="GitHub" title="GitHub">GitHub</a>. 14 September 2022.</cite>

</li>

</ol></div></div></div><div><div class="zim-footer">

This article is issued from <a class="external text" title="Last edited on 2025-08-03" href="https://en.wikipedia.org/wiki/?title=Syntax_highlighting&oldid=1304091611">Wikipedia</a>. The text is available under <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-Share Alike 4.0</a> unless otherwise noted. Additional terms may apply for the media files.

</div>

</div></div>

</div>

</main>

</div>

</body></html>